//////////////////////////////////////////////////////////////////////////////////////////
//   _  _ ____ _  _ ___  ____                                                           //
//   |_/  |__| |\ | |  \ |  |    This file belongs to Kando, the cross-platform         //
//   | \_ |  | | \| |__/ |__|    pie menu. Read more on github.com/kando-menu/kando     //
//                                                                                      //
//////////////////////////////////////////////////////////////////////////////////////////

// SPDX-FileCopyrightText: Simon Schneegans <code@simonschneegans.de>
// SPDX-License-Identifier: MIT

@use 'sass:color';

$base-dark: #24272f;
$base-light: #fff;
$key-dark: #9f3b67;
$key-light: #f0cece;

$text-normal: light-dark(#333, #eee);
$text-inverted: light-dark(#eee, #fff);
$text-muted: light-dark(#777, #aaa);
$text-link: light-dark($key-dark, $key-light);
$text-link-hover: light-dark(
  color.adjust($key-dark, $lightness: 10%),
  color.adjust($key-light, $lightness: 10%)
);

$toolbar-background: light-dark(
  rgba(color.adjust($base-light, $lightness: -5%), 0.9),
  rgba(color.adjust($base-dark, $lightness: -5%), 0.9)
);
$window-background: light-dark($base-light, $base-dark);
$modal-background: light-dark(rgba(#747474, 0.5), rgba(156, 169, 205, 0.2));
$popover-background: light-dark($base-light, color.adjust($base-dark, $lightness: -5%));

$widget-primary: light-dark($key-light, $key-dark);
$widget-primary-hover: light-dark(
  color.adjust($key-light, $lightness: -10%),
  color.adjust($key-dark, $lightness: 10%)
);

$widget-dark: light-dark(
  rgba(color.adjust($base-light, $lightness: -30%), 0.5),
  rgba(color.adjust($base-dark, $lightness: 30%), 0.5)
);
$widget-dark-hover: light-dark(
  rgba(color.adjust($base-light, $lightness: -40%), 0.5),
  rgba(color.adjust($base-dark, $lightness: 40%), 0.5)
);

$widget-normal: light-dark(
  rgba(color.adjust($base-light, $lightness: -20%), 0.5),
  rgba(color.adjust($base-dark, $lightness: 20%), 0.5)
);
$widget-normal-hover: light-dark(
  rgba(color.adjust($base-light, $lightness: -30%), 0.5),
  rgba(color.adjust($base-dark, $lightness: 30%), 0.5)
);

$widget-light: light-dark(
  rgba(color.adjust($base-light, $lightness: -10%), 0.5),
  rgba(color.adjust($base-dark, $lightness: 10%), 0.5)
);
$widget-light-hover: light-dark(
  rgba(color.adjust($base-light, $lightness: -20%), 0.5),
  rgba(color.adjust($base-dark, $lightness: 20%), 0.5)
);

$widget-inverted: light-dark(
  rgba(color.adjust($base-light, $lightness: -70%), 0.7),
  rgba(color.adjust($base-dark, $lightness: 50%), 0.7)
);
$widget-inverted-hover: light-dark(
  rgba(color.adjust($base-light, $lightness: -80%), 0.7),
  rgba(color.adjust($base-dark, $lightness: 40%), 0.7)
);

$widget-selected: light-dark(
  rgba(color.mix($key-dark, color.adjust($base-light, $lightness: -10%), 20%), 0.5),
  rgba(color.mix($key-light, color.adjust($base-dark, $lightness: 10%), 30%), 0.5)
);

$widget-selected-hover: light-dark(
  rgba(color.mix($key-dark, color.adjust($base-light, $lightness: -10%), 30%), 0.5),
  rgba(color.mix($key-light, color.adjust($base-dark, $lightness: 10%), 40%), 0.5)
);

$drop-highlight: 0 0 10px light-dark($key-dark, $key-light);
$border-selected: 1px solid light-dark($key-dark, $key-light);
$border-focused: 1px solid
  light-dark(
    color.mix($key-dark, color.adjust($base-light, $lightness: -10%), 50%),
    color.mix($key-light, color.adjust($base-dark, $lightness: 10%), 50%)
  );

$area-border: 1px solid light-dark(rgba(#333, 0.15), rgba(#eee, 0.15));
